<template>
  <el-dialog v-bind='$attrs' v-on='$listeners' title="预览附件" width="80%" :before-close="handleClose" append-to-body>
    <iframe
      :src="list[index]"
      width="100%"
      style="height: calc(100vh - 200px)"
      frameborder="0"
      scrolling="auto"
      id="myIframe"
      name="myIframe"
    ></iframe>
    <!--        <span slot="footer" class="dialog-footer">-->
    <!--        <el-button @click="handleClose" type="primary">确 定</el-button>-->
    <!--      </span>-->
  </el-dialog>
</template>
<script>
  import eventBus from "@/utils/eventBus";

  export default {
    props: {
      files: {
        type: String,
        default: "",
      },
      url: {
        type: String,
        defalut: ""
      }
    },
    data() {
      return {
        index: 0,
        baseUrl: process.env.VUE_APP_BASE_API,
        list: []
      }
    },
    computed: {},
    watch: {},
    created() {
      console.log("this.$attrs", this.$attrs)
      console.log(" 44--> ", this.url)
      if (this.url) {
        let _ary = this.url.split("|")
        let _url = _ary[_ary.length - 1]
        this.list = [this.baseUrl + "/api/document/attachment/?url=" + _url]
      } else {
        this.getList()
      }
      eventBus.$on("activeIndex", index => {
        this.index = index
      })
    },
    methods: {
      getList() {
        this.list = []
        let _list = this.files.split(",")
        for (let i = 0; i < _list.length; i++) {
          let _ary = _list[i].split("|")
          let _url = _ary[_ary.length - 1]
          if (_url.startsWith("http")) {
            //如果给的是全地址。会议申请时上传图片之后，地址是 全路径的。
            this.list.push(_url)
          } else {
            this.list.push(this.baseUrl + "/api/document/attachment/?url=" + _url)
          }
        }
      },
      handleClose() {
        this.$emit("update:visible", false)
      },
      getSubName(fileName) {
        let list = fileName.split(".")
        list[0] = list[0].split("_")[0]
        if (list[0].length > 20) {
          list[0] = list[0].substring(0, 7) + "..." + list[0].substring(list[0].length - 7)
        }
        return list.join(".")
      },
    },
    beforeDestroy() {
      eventBus.$off("activeIndex")
    }
  }
</script>
<style lang="scss" scoped>
  .el-carousel__item {
    .pet-img {
      text-align: center;
    }
  }
</style>
